﻿<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
    <%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
    <%
	String basePath = request.getScheme() + "://" + request.getServerName() + ":" + request.getServerPort()
			+ request.getContextPath()+"/";
	%>
<!DOCTYPE html>
<html lang="en">
    <head>
    	<title>为角色分派菜单</title>
        <meta charset="utf-8">
        <link rel="stylesheet" href="<%=basePath %>css/list.css">
		<link href="<%=basePath %>css/H-ui.min.css" rel="stylesheet" type="text/css" />
		<script src="<%=basePath %>js/jquery.min.js"></script>
		<link rel="stylesheet" href="<%=basePath %>lib/icheck/icheck.css">
        <script src="<%=basePath %>lib/My97DatePicker/WdatePicker.js"></script>
        <script src="<%=basePath %>lib/icheck/jquery.icheck.min.js"></script>
		<script src="<%=basePath %>js/H-ui.js"></script>
		<script src="${pageContext.request.contextPath}/lib/bootstrap-modal/2.2.4/bootstrap-modalmanager.js"></script>
        <script src="${pageContext.request.contextPath}/lib/bootstrap-modal/2.2.4/bootstrap-modal.js"></script>
        <style>
        	.input-text, .textarea{
        		width: auto;
        	}
        </style>
        
        <script type="text/javascript">
		function doClick(type,o){
			var menu=document.getElementsByName("checkboxId");
			if(type==1){
			//点击父级，子级全选/不选
				for(var i=0;i<menu.length;i++){
	 				if(menu[i].title==o.value){
						menu[i].checked=o.checked;
					}
				}
			}else{
				var par;
				var b=false;
				//点击子级，父级选中
				for(var i=0;i<menu.length;i++){
					//找到对应的父级
					if(o.title==menu[i].value){
						par=menu[i];
					}
					//子级全不选，父级不选
					if(o.title==menu[i].title&&menu[i].checked==true){
						b=true;
					}
				}
				par.checked=b;
			}
		}
		
		function saveMenu(){
			var roleId = document.getElementById("roleId").value;
			var x=document.getElementsByName("checkboxId");
			var checkId = [];
			for (var i=0;i<x.length;i++){
			    if(x[i].checked==true){
				 checkId.push(x[i].value);
				}
			}
			//alert(checkId);
		    document.form1.action = '${pageContext.request.contextPath}/sysRole/againAssignMenu?roleId='+roleId+'&menuIds='+checkId;
			document.form1.submit();
		}
		
		function backList(){
			//http://localhost:8080/wfcmp/sysRole/sysRoleList
		    document.form1.action = '${pageContext.request.contextPath}/sysRole/sysRoleList';
			document.form1.submit();
		}
		
		function lickMsg(){
			$("#errorMessage").hide();
		}
		window.setTimeout("lickMsg()",3000);
	
	</script>
    </head>
    <body>
    	<div class="connect_wrap">
    	<br/>
    	
		<form role="form" name="form1" id="form1" method="post" >
			<table class="table table-border table-bordered table-striped table-hover">
			<tr style="font-weight: bold;">
				<td colspan="4">
					<input class="btn btn-primary " type="button" value="返回" onclick="javascript:backList()">&nbsp;&nbsp;
					<input class="btn btn-success " type="button" value="保存" onclick="javascript:saveMenu()">
				</td>
		   	</tr>
			<%-- <div id="errorMessage" align="center" style="color: #ff0000; font-size: 18px;">${message }</div> --%>
			
			<tbody>
				<tr style="font-weight: bold;">
					<input type="hidden" id="roleId" name="roleId" value="${role.id }" />
					<td class="tdl">角色名称</td>
					<td>
						<input type="text" class="ipt" readonly="readonly" name="role.roleName" value="${role.name }" />
					</td>
					<td class="tdl">角色说明</td>
					<td>
						<input type="text" class="ipt" readonly="readonly" name="role.roleDesc" size="30px" value="${role.intro }" />
					</td>
				</tr>
				<tr style="font-weight: bold;">
		   			<td>菜单</td>
		   			<td colspan="3">
			   			<c:forEach var="menu" items="${MenuList }">
			   				<div <c:if test="${menu.menuLevel==2 }">style="margin-left:20px;"</c:if>>
								<input id="menuId" title="${menu.parentMenuId }" onclick="doClick('${menu.menuLevel}',this)" ${menu.isSelected } type="checkbox" name="checkboxId" value="${menu.menuId }">
								${menu.menuName }
			   				</div>
			   			</c:forEach>
		   			</td>
		   		</tr>
			
			</tbody>
			</table>
		</form>
		
    	</div>
    </body>
    
    <script>
    $(function(){
    	$.Huifold("#Huifold1 .item h4","#Huifold1 .item .info","fast",1,"click");
    	
    	$('.orderByRadio').iCheck({
    		checkboxClass: 'icheckbox-blue',
    		radioClass: 'iradio-blue',
    		increaseArea: '20%'
    	});
    	
    	$("#Huifold1 .item h4").click();
    	
    });
    </script>
    <script type="text/javascript">
    function deleteByID(id){
    	var flag= confirm("确认删除吗？");
    	if(flag){
    		var url="<%=basePath %>courseChapter/remove/"+id;
    		location.href= url; 
    	}
    }
    </script>
</html>